<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>CodeMirror</title>
    <link rel="stylesheet" type="text/css" href="css/docs.css"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  </head>
  <body>

<h1><span class="logo-braces">{ }</span> <a href="http://codemirror.net/">CodeMirror</a></h1>

<pre class="grey">
<img src="css/baboon.png" class="logo" alt="logo"/>/* In-browser code editing
   made bearable */
</pre>

<div class="clear"><div class="left blk">

  <p style="margin-top: 0">CodeMirror is a JavaScript library that can be used to create a
  relatively pleasant editor interface for code-like content &#x2015;
  computer programs, HTML markup, and similar. If a parser has been
  written for the language you are editing (see below for a list of
  supported languages), the code will be coloured, and the editor will
  help you with indentation.</p>
 
  <div class="clear"><div class="left1 blk">

    <h2 style="margin-top: 0">Try the parser test pages:</h2>

    <ul>
      <li><a href="jstest.html">JavaScript</a></li>
      <li><a href="htmltest.html">XML/HTML</a></li>
      <li><a href="csstest.html">CSS</a></li>
      <li><a href="mixedtest.html">HTML mixed-mode</a></li>
      <li><a href="sparqltest.html">SPARQL</a></li>
      <li><a href="contrib/php/index.html">HTML+PHP mixed-mode</a></li>
      <li><a href="contrib/python/index.html">Python</a></li>
      <li><a href="contrib/lua/index.html">Lua</a></li>
      <li><a href="http://github.com/hakunin/ruby-in-codemirror/tree/master">Ruby</a> (unfinished)</li>
      <li><a href="contrib/sql/index.html">SQL</a></li>
      <li><a href="contrib/plsql/index.html">PLSQL</a></li>
      <li><a href="http://www.liranuna.com/diff-parser-for-codemirror/">diff</a></li>
      <li><a href="contrib/groovy/index.html">Groovy</a></li>
      <li><a href="contrib/csharp/index.html">C#</a></li>
      <li><a href="contrib/scheme/index.html">Scheme</a></li>
      <li><a href="contrib/java/index.html">Java</a></li>
      <li><a href="contrib/xquery/index.html">XQuery</a></li>
      <li><a href="contrib/ometa/index.html">OmetaJS</a></li>
      <li><a href="contrib/freemarker/index.html">Freemarker</a></li>
      <li><a href="contrib/regex/index.html">Regular Expressions</a></li>
    </ul>

  </div><div class="left2 blk">

    <h2 style="margin-top: 0">Some real-world uses:</h2>

    <ul>
      <li><a href="http://kml-samples.googlecode.com/svn/trunk/interactive/index.html">Google Earth KML sampler</a></li>
      <li><a href="http://eloquentjavascript.net/chapter1.html">Eloquent JavaScript's console</a></li>
      <li><a href="http://demo.qooxdoo.org/current/playground/#Hello_World">The qooxdoo playground</a></li>
      <li><a href="http://billmill.org/static/canvastutorial/index.html">A cool tutorial about the &lt;canvas> element</a></li>
      <li><a href="http://orc.csres.utexas.edu/tryorc.shtml">An online IDE for the Orc programming language</a></li>
      <li><a href="http://code.google.com/apis/ajax/playground">Google's API playground</a></li>
      <li><a href="http://craic.com/tutorials/javascript/raphael_live/raphael_live.html">Raphaël Live</a></li>
      <li><a href="http://jsbin.com/">JS Bin</a></li>
      <li><a href="http://www.rockettheme.com/extensions-joomla/rokpad">The RokPad plugin for Joomla</a></li>
      <li><a href="http://scraperwiki.com/editor/">The scraperwiki editor</a></li>
      <li><a href="http://www.linb.net/VisualJS/UIBuilder.html">jsLinb UI Builder</a></li>
      <li><a href="http://code.google.com/p/zk-codemirror/">ZK CodeMirror component</a> (<a href="http://www.jease.org/codemirror/">demo</a>)</li>
      <li><a href="http://zen-coding.ru/codemirror/">'Zen Coding' on top of CodeMirror</a></li>
      <li><a href="http://demo.mywebsql.net/">Web-based MySQL administration</a></li>
    </ul>

  </div></div>

  <h2 id="supported">Supported browsers</h2>

  <p>The following browsers are able to run CodeMirror:</p>

  <ul>
    <li>Firefox 1.5 or higher</li>
    <li>Internet Explorer 6 or higher</li>
    <li>Safari 3 or higher</li>
    <li>Opera 9.52 or higher</li>
    <li>Chrome</li>
  </ul>

  <p>I am not actively testing against every new browser release, and
  vendors have a habit of introducing bugs all the time, so I am
  relying on the community to tell me when something breaks. See <a
  href="#support">below</a> for information on how to contact me.</p>

  <h2 id="code">Getting the code</h2>

  <p>All of CodeMirror is released under a <a
  href="LICENSE">zlib-style</a> license. To get it, you can download
  the <a href="http://codemirror.net/codemirror.zip">latest
  release</a> or the current <a
  href="http://codemirror.net/codemirror-latest.zip">development
  snapshot</a> as zip files. To create a custom minified script file,
  you can use the <a href="compress.html">compression API</a>.</p>

  <p>We use <a href="http://git-scm.com/">git</a> for version control.
  The main repository can be fetched in this way:</p>

  <pre class="code">git clone http://marijnhaverbeke.nl/git/codemirror</pre>

  <p>CodeMirror can also be found on GitHub: <a
  href="http://github.com/marijnh/CodeMirror">http://github.com/marijnh/CodeMirror</a>.
  If you plan to hack on the code and contribute patches, the best way
  to do it is to create a GitHub fork, and send pull requests.</p>

  <h2 id="documention">Documentation</h2>

  <p>The <a href="manual.html">manual</a> is your first stop for
  learning how to use this library. It starts with a quick explanation
  of how to use the editor, and then describes all of the (many)
  options and methods that CodeMirror exposes.</p>

  <p>For those who want to learn more about the code, <a
  href="story.html">this document</a> about CodeMirror's architecture
  will be useful. The <a
  href="http://github.com/marijnh/CodeMirror">source code</a> itself
  is, for the most part, also very well commented.</p>

  <h2 id="support">Support</h2>

  <p>There is a <a
  href="http://groups.google.com/group/codemirror">Google group</a> (a
  sort of mailing list/newsgroup thing) for discussion and news
  related to CodeMirror. Please check the <a href="faq.html">FAQ</a>
  before asking a question. You can also e-mail me directly: <a
  href="mailto:marijnh@gmail.com">Marijn Haverbeke</a>.</p>

</div>

<div class="right blk">

  <a href="http://codemirror.net/codemirror.zip" class="download">Download the latest release</a>

  <h2>Make a donation</h2>

  <ul>
    <li><span onclick="document.getElementById('paypal').submit();" class="quasilink">Paypal</span></li>
    <li><span onclick="document.getElementById('bankinfo').style.display = 'block';" class="quasilink">Bank</span></li>
  </ul>

  <p id="bankinfo" style="display: none;">
    Bank: <i>Rabobank</i><br/>
    Country: <i>Netherlands</i><br/>
    SWIFT: <i>RABONL2U</i><br/>
    Account: <i>147850770</i><br/>
    Name: <i>Marijn Haverbeke</i><br/>
    IBAN: <i>NL26 RABO 0147 8507 70</i>
  </p>

  <h2>Releases:</h2>

  <p class="rel">19-01-2011: <a href="http://codemirror.net/codemirror-0.93.zip">Version 0.93</a>:</p>
  <ul class="rel-note">
    <li>Added a <a href="contrib/regex/index.html">Regular Expression</a> parser.</li>
    <li>Fixes to the PHP parser.</li>
    <li>Support for regular expression in search/replace.</li>
    <li>Add <code>save</code> method to instances created with <code>fromTextArea</code>.</li>
    <li>Add support for MS T-SQL in the SQL parser.</li>
    <li>Support use of CSS classes for highlighting brackets.</li>
    <li>Fix yet another hang with line-numbering in hidden editors.</li>
  </ul>

  <p class="rel">17-12-2010: <a href="http://codemirror.net/codemirror-0.92.zip">Version 0.92</a>:</p>
  <ul class="rel-note">
    <li>Make CodeMirror work in XHTML documents.</li>
    <li>Fix bug in handling of backslashes in Python strings.</li>
    <li>The <code>styleNumbers</code> option is now officially
    supported and documented.</li>
    <li><code>onLineNumberClick</code> option added.</li>
    <li>More consistent names <code>onLoad</code> and
    <code>onCursorActivity</code> callbacks. Old names still work, but
    are deprecated.</li>
    <li>Add a <a href="contrib/freemarker/index.html">Freemarker</a> mode.</li>
  </ul>

  <p class="rel">11-11-2010: <a
  href="http://codemirror.net/codemirror-0.91.zip">Version 0.91</a>:</p>
  <ul class="rel-note">
    <li>Adds support for <a href="contrib/java">Java</a>.</li>
    <li>Small additions to the <a href="contrib/php">PHP</a> and <a href="contrib/sql">SQL</a> parsers.</li>
    <li>Work around various <a href="https://bugs.webkit.org/show_bug.cgi?id=47806">Webkit</a> <a href="https://bugs.webkit.org/show_bug.cgi?id=23474">issues</a>.</li>
    <li>Fix <code>toTextArea</code> to update the code in the textarea.</li>
    <li>Add a <code>noScriptCaching</code> option (hack to ease development).</li>
    <li>Make sub-modes of <a href="mixedtest.html">HTML mixed</a> mode configurable.</li>
  </ul>

  <p class="rel">02-10-2010: <a
  href="http://codemirror.net/codemirror-0.9.zip">Version 0.9</a>:</p>
  <ul class="rel-note">
    <li>Add support for searching backwards.</li>
    <li>There are now parsers for <a href="contrib/scheme/index.html">Scheme</a>, <a href="contrib/xquery/index.html">XQuery</a>, and <a href="contrib/ometa/index.html">OmetaJS</a>.</li>
    <li>Makes <code>height: "dynamic"</code> more robust.</li>
    <li>Fixes bug where paste did not work on OS X.</li>
    <li>Add a <code>enterMode</code> and <code>electricChars</code> options to make indentation even more customizable.</li>
    <li>Add <code>firstLineNumber</code> option.</li>
    <li>Fix bad handling of <code>@media</code> rules by the CSS parser.</li>
    <li>Take a new, more robust approach to working around the invisible-last-line bug in WebKit.</li>
  </ul>

  <p class="rel">22-07-2010: <a
  href="http://codemirror.net/codemirror-0.8.zip">Version 0.8</a>:</p>
  <ul class="rel-note">
    <li>Add a <code>cursorCoords</code> method to find the screen
    coordinates of the cursor.</li>
    <li>A number of fixes and support for more syntax in the PHP parser.</li>
    <li>Fix indentation problem with JSON-mode JS parser in Webkit.</li>
    <li>Add a <a href="compress.html">minification</a> UI.</li>
    <li>Support a <code>height: dynamic</code> mode, where the editor's
    height will adjust to the size of its content.</li>
    <li>Better support for IME input mode.</li>
    <li>Fix JavaScript parser getting confused when seeing a no-argument
    function call.</li>
    <li>Have CSS parser see the difference between selectors and other
    identifiers.</li>
    <li>Fix scrolling bug when pasting in a horizontally-scrolled
    editor.</li>
    <li>Support <code>toTextArea</code> method in instances created with
    <code>fromTextArea</code>.</li>
    <li>Work around new Opera cursor bug that causes the cursor to jump
    when pressing backspace at the end of a line.</li>
  </ul>

  <p class="rel">27-04-2010: <a
  href="http://codemirror.net/codemirror-0.67.zip">Version
  0.67</a>:</p>
  <p class="rel-note">More consistent page-up/page-down behaviour
  across browsers. Fix some issues with hidden editors looping forever
  when line-numbers were enabled. Make PHP parser parse
  <code>"\\"</code> correctly. Have <code>jumpToLine</code> work on
  line handles, and add <code>cursorLine</code> function to fetch the
  line handle where the cursor currently is. Add new
  <code>setStylesheet</code> function to switch style-sheets in a
  running editor.</p>

</div></div>

<div style="height: 2em">&nbsp;</div>

  <form action="https://www.paypal.com/cgi-bin/webscr" method="post" id="paypal">
    <input type="hidden" name="cmd" value="_s-xclick"/>
    <input type="hidden" name="hosted_button_id" value="3FVHS5FGUY7CC"/>
  </form>

  <script type="text/javascript" src="css/font.js"></script>

  </body>
</html>
